<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
    #div1 {width: 100px; height: 100px; background-color: red;}
    #div1:hover{background-color: royalblue;}  /* 鼠标移入的时候生效  可以给任意标签*/
    #div1:active{background-color: salmon;}    /* 鼠标按下的时候生效 客气添加在任意标签*/

  a:link{color: red;}
  a:visited{color: royalblue;}
  a:hover{color: sandybrown;}
  a:active{color: springgreen;}

#div2{width: 100px; height: 100px; background-color: red;}
#div2 :after{ content: "world";}


/* ：link        访问签的样式（只能添加给a标签）
   ：visited   访问后的样式（只能添加给a标签）
   :  hover    鼠标移入时的样式（可以给所有的标签添加）
   :  activer   鼠标按下时的样式（可以给所有的标签添加）
 */
 
    </style>
</head>
<body>
    <div id= "div1" > </div>
    <br>

    <a href="https://www.bilibili.com/">这是一个B站链接</a>
    <br>
<div id="div2"> holle</div>

</body>
</html>